import { passwordEdit } from '@/services/users';
import { ModalForm, ProFormText } from '@ant-design/pro-components';
import { Form, message } from 'antd';
import React, { useState } from 'react';

const PasswordSetting: React.FC<any> = (props) => {
  const { user } = props;
  const [isModalOpen, setIsModalOpen] = useState(false);
  const showModal = () => {
    setIsModalOpen(true);
  };

  const handleOk = () => {
    setIsModalOpen(false);
  };

  const handleCancel = () => {
    setIsModalOpen(false);
  };
  const [form] = Form.useForm<{
    userId: number;
    password: string;
  }>();
  return (
    <ModalForm<{
      userId: number;
      password: string;
    }>
      title="修改密码"
      width={400}
      trigger={<a key="link">修改密码</a>}
      initialValues={{
        userId: props.id,
      }}
      layout="vertical"
      form={form}
      autoFocusFirstInput
      modalProps={{
        destroyOnClose: true,
        onCancel: () => console.log('run'),
      }}
      submitTimeout={2000}
      onFinish={(values) => {
        console.log(values);
        message.success('提交成功');
        return new Promise<boolean>((resolve, reject) => {
          passwordEdit(values)
            .then((res) => {
              resolve(true);
              message.success('提交成功');
            })
            .catch((err) => {
              reject(false);
              message.error('提交失败');
            });
        });
      }}
    >
      <ProFormText
        name="userId"
        hidden={true}
        initialValue={user.id}
      ></ProFormText>
      <ProFormText.Password
        width="md"
        name="password"
        label="新密码"
        placeholder="请输入新密码"
        rules={[
          { required: true, message: '请输入密码' },
          { min: 6, message: '密码长度至少为6个字符' },
          { max: 20, message: '密码长度最多为20个字符' },
        ]}
      />
    </ModalForm>
  );
};

export default PasswordSetting;
//96, 100, 104, 105, 107.239, 230, 361, 1161, 1162, 1148, 238
